<template>
	<view class="main_bg" style="background-color: rgba(247,247,247,1);">

		<view class="login_bg">
			<app-headerIndex title="登录" :isBack="false"></app-headerIndex>
			<view class="login_main">
				<view class="login_title">欢迎登录</view>
				<view class="input_bg flex-c">
					<view class="input  flex-c">
						<u--input placeholder="请输入手机号码" border="none" v-model="form.mobile" clearable></u--input>
					</view>
					<view class="input  flex-c">
						<u--input placeholder="请输入密码" border="none" v-model="form.password" password clearable></u--input>
					</view>



					<!-- <input v-model="form.mobile" placeholder="请输入手机号码" />
					<input v-model="form.password" placeholder="请输入密码" password placeholder-class="phcolor" /> -->
				</view>
				<view class="port flex-c" style="margin-top:30rpx">
					<u-checkbox-group v-model="isRead" shape="circle" activeColor="#0055A6">
						<u-checkbox label="请阅读并同意" name="请阅读并同意">
						</u-checkbox>
					</u-checkbox-group>
					<view @click="$func.toUrl('/pages/article/article?id=1')">《用户服务协议》
					</view>
					和
					<view @click="$func.toUrl('/pages/article/article?id=2')">《隐私政策》
					</view>

				</view>
				<view class="btn flex-c" @click="handleLogin()">登录</view>
				<view class="tips">仅供内部人员使用，请联系管理员获取账号</view>
			</view>

		</view>


		<!-- 	<view class="btn reg" @click="$func.navigateTo" data-url="/pages/login/reg?type=1">注册</view>
		<view class="login flex-s">
	 
			<view class="authBtn" @click="submit()">快捷登录</view>
			<view class="nologin" @click="close">暂不登录</view>
		</view> -->


	</view>
</template>

<script>
	const systemInfo = uni.getSystemInfoSync();

	import {
		setToken
	} from '@/utils/auth'
	export default {
		components: {

		},
		data() {
			return {
				android: systemInfo.platform == 'android',
				isRead: [],
				form: {
					mobile: '',
					openid: '',
					password: ''
				},
				info: {},
				showPwd: false,
				weChatCode: "",
			}
		},

		onBackPress(event) {

		},
		onLoad(option) {
			this.$store.commit("setShowLogin", false)

		},
		mounted() {
			this.getCode()
		},
		methods: {
			getCode() {
				uni.login({
					provider: 'weixin',
					success: (loginRes) => {
						if (loginRes.errMsg == "login:ok") {
							this.weChatCode = loginRes.code
							this.getOpenid()
						} else {
							uni.showToast({
								title: "授权失败，稍后重试",
								icon: 'none'
							});
						}
					}
				});
			},
			getOpenid() {
				this.$http.post("/data/api.Wxapp/getOpenidNew", {
					code: this.weChatCode
				}).then(res => {
					console.log(res.data)
					const {
						openid,
						token
					} = res.data
					this.$set(this.form, 'openid', openid)
					if (token.token) {
						setToken(token.token)
						this.$store.commit('SET_TOKEN', token.token)
						this.$store.dispatch("GetInfo")
						uni.redirectTo({
							url: "/pages/index/index"
						})
					}
				})
			},
			getUserProfile: function(e) {
				let _this = this
				uni.getUserInfo({
					lang: "zh_CN",
					desc: 'Wexin', // 这个参数是必须的
					withCredentials: true,
					success: res => {
						_this.info.iv = res.iv
						_this.info.encryptedData = res.encryptedData
						_this.submit()
					}
				})
			},

			close() {
				// this.$emit('login', {})
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},
			submit() {
				if (this.isRead.length == 0) {
					uni.showModal({
						title: '提示',
						content: '请阅读并同意《用户服务协议》',
						success: (res) => {

							if (res.confirm) {
								this.isRead = ["请阅读并同意"]


							} else if (res.cancel) {

							}
						}
					});
					return
				}
				this.$http.post("/user/account/wxLogin", {
					weChatCode: this.weChatCode
				}).then(res => {
					uni.showToast({
						title: "登录成功",
						duration: 2000
					});
					setToken(res.data.token)
					this.$store.commit('SET_TOKEN', res.data.token)
					this.$store.dispatch("GetInfo")
					uni.redirectTo({
						url: "/pages/index/index"
					})
				}).catch(res => {

					if (res == 1001) {
						uni.showToast({
							title: "请绑定账号",
							duration: 2000
						});
						uni.navigateTo({
							url: "/pages/login/reg?type=4"
						})
					} else {
						uni.showToast({
							title: res.msg,
							duration: 2000
						});
					}

					this.getCode()
				})
			},
			handleLogin() {
				if (!this.form.mobile) {
					uni.showToast({
						title: "请输入手机号",
						icon: 'none'
					});
					return
				}
				if (!this.form.password) {
					uni.showToast({
						title: "请输入密码",
						icon: 'none'
					});
					return
				}
				if (this.isRead.length == 0) {
					uni.showModal({
						title: '提示',
						content: '请阅读并同意《用户服务协议》',
						success: (res) => {

							if (res.confirm) {
								this.isRead = ["请阅读并同意"]


							} else if (res.cancel) {

							}
						}
					});
					return
				}
				uni.showLoading({
					title: "登录中",
					mask: true,
				})
				this.$store.dispatch('Login', this.form).then(() => {
					uni.showToast({
						title: "登录成功",
						icon: 'none'
					});
					this.$store.dispatch("GetInfo")
					uni.redirectTo({
						url: "/pages/index/index"
					})
					uni.hideLoading()
				}).catch(() => {
					uni.hideLoading()
				})
			},


		},
		onPullDownRefresh() {

		},
		onReachBottom() {


		},
		onShareAppMessage() {
			return this.$func.shareApp()
		},
	}
</script>

<style scoped lang="scss">
	.login_bg {
		height: 211px;
		background: rgba(79, 111, 246, 1);
		position: relative;



		.login_main {
			// position: absolute;

			padding-top: 30px;
			width: 100%;

			.login_title {
				padding: 0 10px 14px;
				font-size: 40rpx;
				font-weight: 500;
				color: #FFFFFF;
			}

			.input_bg {
				flex-direction: column;
				margin: 20rpx;
				height: 490rpx;
				background: rgba(255, 255, 255, 1);
				border-radius: 20px;

				.input {
					width: 580rpx;
					height: 104rpx;
					background: rgba(241, 241, 241, 0.39);
					border-radius: 52rpx;
					font-size: 30rpx;
					color: #333;
					padding: 0 40rpx;

					&:nth-child(1) {
						margin-bottom: 60rpx;
					}
				}

				input {
					width: 620rpx;
					height: 104rpx;
					background: rgba(241, 241, 241, 0.39);
					border-radius: 52rpx;
					font-size: 30rpx;
					color: #333;
					padding-left: 40rpx;

					&:nth-child(1) {
						margin-bottom: 60rpx;
					}
				}
			}

		}

		.btn {
			margin: 136rpx auto 46rpx;
			width: 660rpx;
			height: 110rpx;
			background: rgba(79, 111, 246, 1);
			border-radius: 56rpx;
			color: #FFFFFF;
			line-height: 50rpx;


		}

		.tips {

			font-size: 28rpx;
			line-height: 40px;
			color: #ADADAD;
			text-align: center;

		}

	}
</style>